﻿@namespace BlazorComponent
@typeparam TItem
<div class="tabs-wrapper">
    <ul class="tab-list">
        @foreach (var item in Items.Where(x => x.IsVisible))
        {
            var index = Items.IndexOf(item);
            <li class="tab-item @(ActiveIndex == index ? "active" : "")"
                @onclick="() => SelectTab(index)">
                @item.Title
            </li>
        }
    </ul>
    <div class="tab-panels">
        @if (ActiveIndex >= 0 && ActiveIndex < Items.Count)
        {
            @Items[ActiveIndex].Content
        }
    </div>
</div>

@code {
    /// <summary>
    /// Source list of all tabs
    /// </summary>
    [Parameter, EditorRequired]
    public List<CustomTabItem<TItem>> Items { get; set; } = new();

    /// <summary>
    /// Index of the currently active tab
    /// </summary>
    [Parameter]
    public int ActiveIndex { get; set; }

    /// <summary>
    /// Event callback when active tab changes
    /// </summary>
    [Parameter]
    public EventCallback<int> ActiveIndexChanged { get; set; }

    /// <summary>
    /// Additional CSS class for wrapper
    /// </summary>
    [Parameter]
    public string Class { get; set; }

    private async Task SelectTab(int index)
    {
        if (ActiveIndex != index)
        {
            ActiveIndex = index;
            await ActiveIndexChanged.InvokeAsync(index);
        }
    }
}
